import React from 'react'
import { Spin } from 'antd'
import style from './index.module.scss'
import LazyLoad from 'react-lazyload'
export default function BlogList({
  list: { title, creatTime, cover, viewCount },
}: {
  list: BlogList
}) {
  return (
    <div className={style.blog}>
      <div className={style.left}>
        <div className={style.title}>{title}</div>
        <div className={style.time}>
          {creatTime}&nbsp; {viewCount}浏览
        </div>
      </div>
      {cover && (
        <div className={style.cover}>
          <LazyLoad
            scrollContainer="#indexContainer"
            scroll={true}
            placeholder={<Spin style={{ width: '100%' }} />}
          >
            <img src={cover} alt="" />
          </LazyLoad>
        </div>
      )}
    </div>
  )
}
